import React from "react";

export default function Life() {
    //声明状态
    let [count, setCount] = React.useState(100);

    //useEffect   effect 影响
    React.useEffect(() => {
        //该函数会在组件挂载完毕和组件更新完成之后, 自动执行
        // 是 componentDidMount 和 componentDidUpdate 的结合体
        console.log('我执行了~~'); 
        // 模拟 componentWillUnmount 
        return () => {
            console.log('我将要被卸载了~~~');  
        }
    }, []); // []  设置哪些状态改变之后, 执行回调

    return <div>
        <h1>{count}</h1>
        <button onClick={() => {
            setCount(count + 1);
        }}> + </button>
    </div>;
}

/**
 * 生命周期
 *  1. componentDidMount 挂载完毕
 *  2. componentWillUnmount  将要卸载
 *  3. componentDidUpdate  更新完成
 *
 */
